<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 后台管理开发框架</title>
<link href="/favicon.ico" rel="icon">
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="/static/admin/layui/css/layui.css" rel="stylesheet" type="text/css" />
<link href="/static/admin/css/style.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- 重定位style -->
<div class="layui-fluid">
    <div class="layui-card">
        <!-- // 默认操作按钮 -->
        <div class="layui-card-header layuiadmin-card-header-auto ">
        <div class="layui-form">
            <div class="layui-form-item">

            <div class="layui-inline">
                <div class="layui-input-inline ">
                    <select name="status">
                        <option value="">按状态查看</option>
                        <option value="2">已审核</option>                                 
                        <option value="1">未审核</option>                             
                    </select>
                </div>
            </div>

            <div class="layui-inline">
                <div class="layui-input-inline ">
                    <input name="title" class="layui-input" type="text" placeholder="关键字查询"/>
                </div>
            </div>
            <div class="layui-inline" >
                <!-- // 默认搜索 -->
                <button class="layui-btn icon-btn" lay-filter="formSearch" lay-submit><i class="layui-icon layui-icon-search"></i>搜索</button>
                <!-- // 打开添加页面 -->
                <button class="layui-btn icon-btn" lay-open="" lay-title="添加广告" lay-area="600px,468px" lay-url="#editforms" >
                    <i class="layui-icon layui-icon-add-1"></i>添加
                </button>
            </div>
            </div>
        </div>   
        </div>

        <!-- // 创建数据实例 -->
        <table id="lay-tableList" lay-filter="lay-tableList"></table> 
    </div>
</div>

<!-- // 添加编辑栏目 -->
<script type="text/html" id="editforms" >
<div class="layui-fluid layui-bg-white" >
    <form class="layui-form layui-form-fixed" lay-filter="editforms" >
    <input type="text" name="id"  hidden="">
    <div class="layui-form-item">
        <label class="layui-form-label"><font color="red">* </font>广告名称</label>
        <div class="layui-input-block">
            <input name="title" placeholder="请输入广告名称" type="text" class="layui-input"   lay-verify="required" />
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><font color="red">* </font>广告标识</label>
        <div class="layui-input-block">
            <input name="alias" placeholder="请输入非中文广告标识" type="text" class="layui-input"   lay-verify="required" />
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">广告封面</label>
        <div class="layui-input-inline" style="width: 322px">
            <input name="pic" placeholder="广告封面" type="text" class="layui-input picword" />
        </div>
        <button type="button" class="layui-btn layui-btn-normal" lay-upload="" lay-input="picword">上传图片</button>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">到期时间</label>
        <div class="layui-input-block">
            <input name="expirestime" placeholder="到期时间" type="text" class="layui-input"  lay-datetime  lay-verify="required" />
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">到期提醒</label>
        <div class="layui-input-inline">
            <input name="remind" type="radio" value="1" title="开启"  checked />
            <input name="remind" type="radio" value="0" title="关闭" />
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label"><font color="red">* </font>广告代码</label>
        <div class="layui-input-block">
            <textarea name="content" id="content" style="min-height: 110px;" placeholder="请输入广告代码" class="layui-textarea"  lay-verify="required" ></textarea>
        </div>
    </div>
    <div class="layui-footer layui-form-item layui-center"  >
        <button class="layui-btn layui-btn-primary" type="button" pa-event="closePageDialog" >取消</button>
        <button class="layui-btn" lay-add="{:url('/system.adwords/add')}" lay-edit="{:url('/system.adwords/edit')}" lay-filter="submitPage"  lay-submit>提交</button>
    </div>
    </form>
</div>
</script>

<!-- // 列表状态栏 -->
<script type="text/html" id="columnStatus">
    <input type="checkbox" lay-filter="switchStatus" lay-url="{:url('/system.adwords/status')}" value="{{d.id}}" lay-skin="switch"
     {{d.status==1?'checked':''}}  />
</script>

<!-- // 列表工具栏 -->
<script type="text/html" id="tableBar"> 
<a class="layui-table-text" lay-title="编辑 {{d.title}}" lay-area="600px,468px" lay-url="#editforms" lay-event="edit" >编辑</a>
<div class="layui-divider layui-divider-vertical"></div>
<a class="layui-table-text lay-copy" title="获取广告代码" >获取</a>
<div class="layui-divider layui-divider-vertical"></div>
<a class="layui-table-text" lay-url="{:url('/system.adwords/del/')}id/{{d.id}}" lay-event="del" >删除</a>
</script>
<script src="/static/admin/layui/layui.js?v=1.0.0"></script>
<script src="/static/admin/js/common.js?v=1.0.0"></script>
<script>
    layui.use(['table','admin'], function () {
        
        var admin = layui.admin;
        var table = layui.table;
        var jquery = layui.jquery;
        /*
         * 初始化表格
        */
        var isTable = table.render({ 
            elem: "#lay-tableList"
            ,url: "{:url('/system.adwords/index')}"
            ,cols: [[
                {type: 'checkbox', width:45},
                {field: 'id', align: 'center',sort: true,width: 80,  title: 'ID'},
                {field: 'title', align: 'left', title: '广告名称'},
                {field: 'alias', align: 'left', width:180, title: '广告标识'},
                {field: 'status', align: 'center',templet: '#columnStatus', width: 135, title: '状态'},
                {field: 'expirestime', align: 'center',width:180, title: '到期时间'},
                {field: 'createtime', align: 'center', width:180, title: '创建时间'},
                {align: 'center', toolbar: '#tableBar', width:190, title: '操作'},
            ]]
        })

        // 复制广告位代码
        jquery(document).on('click','.lay-copy',function(){

            var index = jquery(this).parents('tr').data('index');
            var data = table.cache['lay-tableList'][index].alias;
            var words = '{';words+= ':';words+= 'get_adwords'; words+= '(\'';words+= data;words+= '\')}';
            var input = document.createElement('input');
            input.setAttribute('readonly', 'readonly');
            input.setAttribute('value', words);
            document.body.appendChild(input);
            input.select();

            if (document.execCommand('copy')) {
                layui.iziToast.success({
                    message:'复制成功',
                })
            }

            // 移除元素
            document.body.removeChild(input);
        })

    })
</script>
